<!DOCTYPE html>
<html>

<head lang="en">
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>Airwallex Checkout Playground</title>
  <script src="https://checkout.airwallex.com/assets/elements.bundle.min.js"></script>
</head>

<body>
  <!-- <h1>DropIn integration</h1> -->
  <div id="dropIn"></div>
  <script>
    //项目中的语言code转换成空中云汇需要的语言code

    var airwallexLocale = {
      'zh_CN': 'zh',
      'en_US': 'en',
      'fr_FR': 'fr',
      'de_DE': 'de',
      'it_IT': 'it',
      'pl_PL': 'en',
      'pt_PT': 'en',
      'es_ES': 'es'
    }
    //参数
    var airwallexObj = localStorage.getItem('airwallexObj') ? JSON.parse(localStorage.getItem('airwallexObj')) : {};
    Airwallex.init({
      env: airwallexObj.env, // demo:测试 prod:正式
      origin: window.location.origin, // Setup your event target to receive the browser events message
			locale: airwallexLocale[airwallexObj.locale],
    });
		if(airwallexObj.payType == 'google'){
			gooleAirwallex();
		}else if(airwallexObj.payType == 'apple'){
			appleAirwallex();
		}
		function gooleAirwallex(){
			const dropIn = Airwallex.createElement('dropIn', {
			  intent_id: airwallexObj.intentId,
			  client_secret: airwallexObj.clientSecret,
			  currency: airwallexObj.currency,
			  methods: ['googlepay'],
			  // 谷歌支付
			  googlePayRequestOptions: {
			    countryCode: airwallexObj.countryCode,
			  },
			});
			const domElement = dropIn.mount('dropIn');
			domElement.addEventListener('onReady', (event) => {
				window.parent.postMessage({airwallexReady:event.detail}, '*');
			});
			domElement.addEventListener('onSuccess', (event) => {
			  window.parent.postMessage({ airwallexMsg: event.detail }, '*');
			  localStorage.removeItem('airwallexObj')
			});
			domElement.addEventListener('onError', (event) => {
			  window.parent.postMessage({ airwallexError: event.detail }, '*');
			});
		}
		function appleAirwallex(){
			const dropIn = Airwallex.createElement('dropIn', {
			  intent_id: airwallexObj.intentId,
			  client_secret: airwallexObj.clientSecret,
			  currency: airwallexObj.currency,
			  methods: ['applepay'],
			  // applePay支付
			  applePayRequestOptions: {
			    countryCode: airwallexObj.countryCode,
			    requiredBillingContactFields: ["postalAddress", "email", "name", "phone"], // optional field
			    requiredShippingContactFields: ["name", "email"], // optional field
			    buttonType: 'buy', // Indicate the type of button you want displayed on your payments form. Like 'buy'
			    buttonColor: 'white-with-line', // Indicate the color of the button. Default value is 'black' 
			  },
			});
			const domElement = dropIn.mount('dropIn');
			domElement.addEventListener('onReady', (event) => {
				window.parent.postMessage({airwallexReady:event.detail}, '*');
			});
			domElement.addEventListener('onSuccess', (event) => {
			  window.parent.postMessage({ airwallexMsg: event.detail }, '*');
			  localStorage.removeItem('airwallexObj')
			});
			domElement.addEventListener('onError', (event) => {
			  window.parent.postMessage({ airwallexError: event.detail }, '*');
			});
		}
    
  </script>
</body>

</html>